<template>
	<view>
		<u-navbar title="场景设置" titleStyle="color:#fff;" :placeholder="true" leftIconColor="#fff" :autoBack="true"
			bgColor="#1F1F1F">

		</u-navbar>
		<view class="scene_set_tabs">
			<view class="item" :class="tabsIndex == 0?'hover':''" @click="clickTabs(0)">
				推荐词条
			</view>
			<view class="item" :class="tabsIndex == 1?'hover':''" @click="clickTabs(1)">
				基础设置
			</view>
		</view>

		<view v-if="tabsIndex == 0" class="entries">
			<view class="item" v-for="(item,index) in recommendData" :key="index">

				<view class="cover" v-if="item.video_url">
								
					<view class="video-action" v-if="!item.playStatus" @click="playRecommendVideo(index)">
						<u-icon name="play-right-fill" size="40rpx" color="#ffffff"></u-icon>
					</view>
					<!-- <image @click="onPlayVideo(index,'sVideo')" class="ph" :src="item.video_img" mode="aspectFill"></image>
					<image @click="onPlayVideo(index,'sVideo')" class="ico_play2" src="/static/img/ico_play2.png"
						mode="widthFix"></image> -->
					<!-- <video @fullscreenchange="fullscreenchange" style="width: 0;height: 0;" :src="item.video_url"
						:id="'sVideo'+index"></video> -->
						<DomVideoPlayer :ref="'sVideo_' + index" style="width: 100%;height: 100%;" :src="item.video_url" :controls="false" :isLoading="true" :poster="item.video_img" @fullscreenchange="onFullscreenChange">
						</DomVideoPlayer>
				</view>
				<view class="cover" v-else-if="!item.video_url&&item.speed_assets">
					<image class="ph" :src="item.speed_assets.image_file" mode="aspectFill"></image>
					<image class="ico_video" src="/static/img/ico_loading.png" mode="widthFix"></image>
				</view>
				<view class="cover" v-else>
					<image class="ico_video" src="/static/img/ico_video.png" mode="widthFix"></image>
				</view>
				<view class="info">
					<view class="title">
						{{item.title}}
					</view>
					<view class="btns">
						<view v-if="!item.video_url&&!item.speed_assets" class="btns_item" @click="gotoSynth(item.title,item.id)">
							<image class="ico" src="/myPages/static/img/play_btn.png" mode="widthFix"></image>
							<text>合成</text>
						</view>
						<view v-if="!item.video_url&&item.speed_assets&&item.speed_assets.status == 4" class="btns_item"
							@click="gotoSynth(item.title,item.id)">
							<image class="ico" src="/myPages/static/img/play_btn.png" mode="widthFix"></image>
							<text>重新合成</text>
						</view>
						<view
							v-if="(!item.video_url&&!item.speed_asset) || (!item.video_url&&item.speed_assets&&item.speed_assets.status == 4)"
							class="btns_item" @click="uploadVideo(item.id)">
							<image class="ico" src="/static/img/upload_btn.png" mode="widthFix"></image>
						</view>

						<view v-if="item.job_id!=0&&item.speed_assets" class="btns_item2">
							<text v-if="item.speed_assets.status == 1">等待中</text>
							<text v-if="item.speed_assets.status == 2">合成中</text>
							<text v-if="item.speed_assets.status == 3">完成</text>
							<text v-if="item.speed_assets.status == 4">失败</text>
						</view>

						<view v-if="item.status!=0&&item.video_url" class="btns_item2">
							<text v-if="item.status == 1">草稿</text>
							<text v-if="item.status == 2">分享</text>
						</view>

						<view class="btns_item" @click="showEntries = true, wordId = item.id, newName = item.title">
							<image class="ico" src="/myPages/static/img/rename_btn.png" mode="widthFix"></image>
						</view>
						<view class="btns_item" v-if="item.video_url" @click="moreSetting(item.id,item.video_url,item.status)">
							<image class="ico" src="/myPages/static/img/more_setting_btn.png" mode="widthFix"></image>
						</view>

					</view>
				</view>

				<view class="btn_sort">
					<view class="btn" v-if="index != 0" @click="postLiveVideoSort(item.id, index, 'up')">
						<image class="ico" src="/myPages/static/img/up_btn.png" mode="widthFix"></image>
					</view>
					<view class="btn" v-if="index != recommendData.length-1" @click="postLiveVideoSort(item.id, index, 'down')">
						<image class="ico" src="/myPages/static/img/down_btn.png" mode="widthFix"></image>
					</view>
				</view>
			</view>

			<view class="item" v-for="(item,index) in liveData" :key="index" v-if="item.category">

				<view class="cover" v-if="item.video_url ">
					<image @click="onPlayVideo(index,'sVideos')" class="ph" :src="item.video_img" mode="aspectFill"></image>
					<image @click="onPlayVideo(index,'sVideos')" class="ico_play2" src="/static/img/ico_play2.png" mode="widthFix"></image>
					<video @fullscreenchange="fullscreenchange" style="width: 100%;height: 100%;" :src="item.video_url" :id="'sVideos'+index"></video>
				</view>

				<view class="info">
					<view class="title">
						{{item.title}}
					</view>
					<view class="btns">

						<view class="btns_item2">
							<text v-if="item.category == 1">开场</text>
							<text v-if="item.category == 2">其他</text>
						</view>

						<view class="btns_item" @click="showEntries = true, wordId = item.id, newName = item.title">
							<image class="ico" src="/myPages/static/img/rename_btn.png" mode="widthFix"></image>
						</view>

						<view class="btns_item" @click="postLiveVideoDel(item.id)">
							<image class="ico" src="/myPages/static/img/del_btn.png" mode="widthFix"></image>
						</view>

						<view class="btns_item" v-if="item.video_url" @click="downloadVideo(item.video_url)">
							<image class="ico" src="/myPages/static/img/download_btn.png" mode="widthFix"></image>
						</view>


					</view>
				</view>


			</view>

		</view>

		<view v-if="tabsIndex == 1">
			<view class="scene_add">

				<!--  -->
				<view class="head-line">
					<view class="head">
						<image class="avatar" v-if="avatar" @click="upCoverPhoto('avatar')" :src="avatar" mode="aspectFill"
							style="display: block;width: 200rpx;height: 200rpx;"></image>
						<image class="avatar" v-else @click="upCoverPhoto('avatar')" src="../static/img/ico_add1.png"
							mode="aspectFill" style="display: block;width: 200rpx;height: 200rpx;"></image>
					</view>
					<view class="name">
						头像
					</view>
				</view>

				<!--  -->
				<view class='line-item'>
					<view class="title">
						标题<text>*</text>
					</view>
					<view class="info">
						<u--input placeholder="请输入标题" border="none" v-model="name"
							customStyle="background:#2C2C2C;padding:12rpx 20rpx;" placeholderStyle="color:#979797;" fontSize="26rpx"
							color="#fff"></u--input>
					</view>
				</view>

				<!--  -->
				<view class='line-item'>
					<view class="title">
						昵称
					</view>
					<view class="info">
						<u--input placeholder="请输入昵称" border="none" v-model="nickname"
							customStyle="background:#2C2C2C;padding:12rpx 20rpx;" placeholderStyle="color:#979797;" fontSize="26rpx"
							color="#fff"></u--input>
					</view>
				</view>


				<!--  -->
				<view class='line-item-block'>
					<view class="line-title">
						<view class="title">
							封面<text></text> <text class="text"> （允许类型: png, jpg, jpeg.）</text>
						</view>
					</view>
					<view class="line-info">
						<image v-if="file" @click="upCoverPhoto('file')" :src="file" mode="aspectFill"
							style="display: block;width: 200rpx;height: 200rpx;border-radius: 15rpx;"></image>
						<image v-else @click="upCoverPhoto('file')" src="/static/img/ico_add1.png" mode="aspectFill"
							style="display: block;width: 200rpx;height: 200rpx;border-radius: 15rpx;"></image>
					</view>
				</view>


				<!--  -->
				<view class='line-item-block'>
					<view class="line-title">
						<view class="title">
							简介<text>*</text><text class="text"> （限制最大70字符）</text>
						</view>
					</view>
					<view class="line-info">
						<textarea class="personal_textarea" placeholder="示例: 你的英语老师" border="none" maxlength="70"
							v-model="sub_title" customStyle="background:#2C2C2C;padding:12rpx 20rpx;"
							placeholderStyle="color:#979797;" fontSize="26rpx" color="#fff" />
					</view>
				</view>

				<!--  -->
				<view class='line-item-block'>
					<view class="line-title">
						<view class="title">
							人设<text>*</text>
						</view>
					</view>
					<view class="line-info">
						<textarea class="personal_textarea"
							placeholder="示例: 你是一名英语老师，姓名：林悦。你教学经验丰富，对学生严格又不失耐心。你总是鼓励我大胆开口说英语，对我的错误会细心纠。" border="none"
							maxlength="2000" v-model="role_discription" customStyle="background:#2C2C2C;padding:12rpx 20rpx;"
							placeholderStyle="color:#979797;" fontSize="26rpx" color="#fff" />
					</view>
				</view>

				<!--  -->
				<view class='line-item'>
					<view class="title">
						分享标题
					</view>
					<view class="info">
						<u--input placeholder="请输入分享的标题" border="none" v-model="share_title"
							customStyle="background:#2C2C2C;padding:12rpx 20rpx;" placeholderStyle="color:#979797;" fontSize="26rpx"
							color="#fff"></u--input>
					</view>
				</view>

				<!--  -->
				<view class='line-item' style="display: none;">
					<view class="title">
						主画面标题<text class="text"></text>
					</view>
					<view class="info">
						<u--input placeholder="请输入主画面标题" border="none" v-model="show_title"
							customStyle="background:#2C2C2C;padding:12rpx 20rpx;" placeholderStyle="color:#979797;" fontSize="26rpx"
							color="#fff"></u--input>
					</view>
				</view>

				<!--  -->
				<view class='line-item-block'>
					<view class="line-title">
						<view class="title">
							选择形象<text class="text"> （选择形象后将不可更改）</text>
						</view>
					</view>
					<view class="line-info">
						<view v-if="default_videoInfo.length == 0" class="scene_select" @click="showImage = true">
							<view class="name">
								请选择一个形象
							</view>
							<u-icon name="arrow-right" color="#F9BE01" size="28rpx"></u-icon>
						</view>
						<!-- 选择后 -->
						<view v-else class="scene_select_image">
							<view style="width: 220rpx; height: 100%;" @click="playVideo()">
								<!-- <video id="pVideo" style="width: 100%; height: 100%;" :src="default_videoInfo.url"></video> -->
								<view class="video-action" v-if="!pVideoPlay">
									<u-icon name="play-right-fill" size="40rpx" color="#ffffff"></u-icon>
								</view>
								<DomVideoPlayer id="profileVideo" ref="profileVideoPlayer" style="width: 100%; height: 100%;" :src="default_videoInfo.url"
									:poster="default_videoInfo.image_file" :controls="false" :isLoading="true">
								</DomVideoPlayer>
							</view>
							<view class="btn" @click="showImage = true" style="display:none">
								重选
							</view>
						</view>
					</view>
				</view>

				<!--  -->
				<view class='line-item-block'>
					<view class="line-title">
						<view class="title">
							选择角色声音
						</view>
					</view>
					<view class="line-info">
						<view v-if="default_audioInfo.length == 0" class="scene_select" @click="showSound = true">
							<view class="name">
								请选择一个角色合成声音
							</view>
							<u-icon name="arrow-right" color="#F9BE01" size="28rpx"></u-icon>
						</view>
						<!-- 选择后 -->
						<view v-else class="scene_select_sound">
							<image v-if="playIndex == 100" @click="clickOnStopAudio()" class="ico" src="../../static/img/ico_stop.png"
								mode="widthFix"></image>
							<image v-else class="ico" @click="clickOnPlayAudio(default_audioInfo.demo_url, 100)"
								src="/static/img/ico_play.png" mode="widthFix"></image>

							<view class="name">
								{{default_audioInfo.title}}
								<text v-if="default_audioInfo.type == 10"> - 公共</text>
								<text v-else> - 定制</text>
							</view>
							<view v-if="isPrivate == 5" class="btn" @click="showSound = true">
								重选
							</view>
						</view>
					</view>
				</view>

				<!--  -->
				<view class='line-item-block'>
					<view class="line-title">
						<view class="title">
							选择语音小助理声音
						</view>
					</view>
					<view class="line-info">
						<view v-if="audioInfo.length == 0" class="scene_select" @click="showAiSound = true">
							<view class="name">
								请选择一个小助理回复声音
							</view>
							<u-icon name="arrow-right" color="#F9BE01" size="28rpx"></u-icon>
						</view>
						<!-- 选择后 -->
						<view v-else class="scene_select_sound">
							<image v-if="playIndex == 200" @click="clickOnStopAudio()" class="ico" src="../../static/img/ico_stop.png"
								mode="widthFix"></image>
							<image v-else class="ico" @click="clickOnPlayAudio(audioInfo.auditionUrl, 200)"
								src="/static/img/ico_play.png" mode="widthFix"></image>

							<view class="name">
								{{audioInfo.name}}
							</view>
							<view v-if="isPrivate == 5" class="btn" @click="showAiSound = true">
								重选
							</view>
						</view>
					</view>
				</view>

			</view>
		</view>

		<view v-if="tabsIndex == 0" class="footer_none"></view>
		<view v-if="tabsIndex == 0" class="footer_yellow_btn" @click="showAddEntries = true,wordTitle = '',wordkey=''">
			新增词条
		</view>

		<view v-if="tabsIndex == 1" class="yellow_btn" @click="postLiveUpdate">
			<view class="btn">
				保存设置
			</view>
		</view>


		<!-- 词条名称 -->
		<u-popup :show="showEntries" mode="center" bgColor="#484848" round="10rpx" :safeAreaInsetBottom="false"
			@close="closeEntries" @open="openEntries">
			<view class="entries_box">
				<view class="title">
					词条名称
				</view>
				<view class="entries_input">
					<u--input placeholder="请输入形象的名称" border="none" v-model="newName"
						customStyle="background:#2C2C2C;padding:12rpx 20rpx;" placeholderStyle="color:#979797;" fontSize="26rpx"
						color="#fff"></u--input>
				</view>
				<view class="entries_box_btn">
					<view class="item" @click="showEntries = false">
						取消
					</view>
					<view class="item yellow" @click="postLiveVideoUpdate()">
						提交
					</view>
				</view>
			</view>
		</u-popup>

		<!-- 我的形象 -->
		<u-popup :show="showImage" :closeable="true" mode="center" bgColor="#484848" round="10rpx" @close="closeImage"
			@open="openImage">
			<view class="select_box">
				<view class="title">
					我的形象
				</view>
				<view class="image_list">
					<view class="item" v-for="(item,index) in sourceData" :key="index">
						<view class="info">
							<image class="ph" :src="item.image_file" mode="aspectFill"></image>
							<view class="name">
								{{item.title}}
							</view>
						</view>
						<view class="btn" @click="selectImage(item)">
							选中
						</view>
					</view>
				</view>
			</view>
		</u-popup>

		<!-- 合成声音 -->
		<u-popup :show="showSound" :closeable="true" mode="center" bgColor="#484848" round="10rpx" @close="closeSound"
			@open="openSound">
			<view class="select_box">
				<view class="title">
					合成声音
				</view>
				<view class="sound_list">
					<view class="item" v-for="(item,index) in voiceData" :key="index">
						<image v-if="playIndex == index" @click="clickOnStopAudio()" class="ico" src="../../static/img/ico_stop.png"
							mode="widthFix"></image>
						<image v-else class="ico" @click="clickOnPlayAudio(item.demo_url, index)"
							src="/static/img/ico_play.png" mode="widthFix"></image>

						<view class="name">
							{{item.title}}
							<text v-if="item.type == 10"> - 公共</text>
							<text v-else> - 定制</text>
						</view>
						<view class="btn" @click="selectSound(item)">
							选中
						</view>
					</view>
				</view>
			</view>
		</u-popup>

		<!-- 小助理声音 -->
		<u-popup :show="showAiSound" :closeable="true" mode="center" bgColor="#484848" round="10rpx" @close="closeAiSound"
			@open="openAiSound">
			<view class="select_box">
				<view class="title">
					小助理声音
				</view>
				<view class="sound_list">
					<view class="item" v-for="(item,index) in assistData" :key="index">
						<image v-if="playIndex == index" @click="clickOnStopAudio()" class="ico" src="/static/img/ico_stop.png"
							mode="widthFix"></image>
						<image v-else class="ico" @click="clickOnPlayAudio(item.auditionUrl, index)"
							src="/static/img/ico_play.png" mode="widthFix"></image>

						<view class="name">
							{{item.name}}
						</view>
						<view class="btn" @click="selectAiSound(item)">
							选中
						</view>
					</view>
				</view>
			</view>
		</u-popup>

		<!-- 操作菜单 -->
		<u-popup :show="showPower" @close="closePower" @open="openPower" mode="bottom" bgColor="#2C2C2C" round="30rpx">
			<view class="power_sheet">
				<view class="item" v-for="(item,index) in listSheet" :key="index" @click="clickSheetPower(item.val,item.name)">
					{{item.name}}
				</view>
			</view>
		</u-popup>

		<!-- 新增词条 -->
		<u-popup :show="showAddEntries" mode="center" bgColor="#484848" round="10rpx" :safeAreaInsetBottom="false"
			@close="closeAddEntries" @open="openAddEntries">
			<view class="entries_box">
				<view class="title">
					新增词条
				</view>
				<view class="entries_input">
					<u--input placeholder="请输入名称" border="none" v-model="wordTitle"
						customStyle="background:#2C2C2C;padding:12rpx 20rpx;" placeholderStyle="color:#979797;" fontSize="26rpx"
						color="#fff"></u--input>
				</view>
				<view class="entries_input">
					<u--input placeholder="请输入关键词" border="none" v-model="wordkey"
						customStyle="background:#2C2C2C;padding:12rpx 20rpx;" placeholderStyle="color:#979797;" fontSize="26rpx"
						color="#fff"></u--input>
				</view>
				<view class="entries_box_btn">
					<view class="item" @click="showAddEntries = false">
						取消
					</view>
					<view class="item yellow" @click="postLiveVideoAdd">
						提交
					</view>
				</view>
			</view>
		</u-popup>

	</view>
</template>

<script>
	import DomVideoPlayer from "@/components/DomVideoPlayer/DomVideoPlayer.vue";
	export default {
		components: {
			DomVideoPlayer
		},
		data() {
			return {
				tabsIndex: 0,
				showEntries: false,
				showPower: false,
				listSheet: [],
				newName: '',
				name: '',
				fileList1: [{
					url: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
				}],

				showImage: false,
				showSound: false,
				showAiSound: false,
				assistData: [],
				voiceData: [],
				sourceData: [],

				name: '',
				file: '',
				sub_title: '',

				share_title: '',
				show_title: '',
				nickname: '',
				avatar: '',

				role_discription: '',

				default_videoInfo: {},
				default_audioInfo: {},
				audioInfo: {},

				showAddEntries: false,
				userId: 0,
				id: '',
				isPrivate: 5,
				recommendData: [],
				liveData: [],
				liveInfo: {},
				livesConfigInfo: {},
				wordTitle: '',
				wordkey: '',
				wordId: '',
				cId: '',
				innerAudioContext: null,
				playIndex: null,
				changeId: '',
				downloadUrl: '',
				itemStatus: '',
				userInfo: {},
				/** 形象视频是否播放 */
				pVideoPlay: false,
			}
		},
		onLoad(opt) {
			this.userId = uni.getStorageSync('userId');
			if (uni.getStorageSync('isLogin')) {
				try{
					if(uni.getStorageSync('userInfo')){
						this.userInfo = JSON.parse(uni.getStorageSync('userInfo'));
						if(this.userId == 0){
							this.userId = uni.getStorageSync('userInfo').user_id;
						}
					}
				}catch(error){
					console.error('json parse error', error);
				}
				
			}
			this.id = opt.id
			console.log('--onload---', this.id);
			//this.isPrivate = opt.isPrivate
			this.getRecommendData()
			this.getLiveData()
			this.getLiveVideoInfo()
			this.getLivesConfigInfo()

			this.getSourceList()
			this.getVoiceList()
			this.getAliyunOssSing()
			this.assistantList()

			// 播放声音管理器
			this.innerAudioContext = uni.createInnerAudioContext();
			this.innerAudioContext.onPlay(() => {
				console.log('开始播放');
			});
			this.innerAudioContext.onStop(() => {
				console.log('停止播放');
			});
			this.innerAudioContext.onEnded(() => {
				console.log('自然播放结束');
				this.playIndex = null
			});

		},
		onUnload() {
			console.log('后退');
			this.innerAudioContext.stop();
			this.innerAudioContext = null
			this.playIndex = null
		},
		onShow() {
			console.log('-onshow-');
			this.getRecommendData()
			this.getLiveData()
			this.getLiveVideoInfo()
			this.getLivesConfigInfo()

			this.getSourceList()
			this.getVoiceList()
			this.getAliyunOssSing()
			this.assistantList()
			this.updateUserdata()
			
		},
		methods: {
			updateUserdata() {
				uni.$u.http.post('/api/update_userdata/' + this.userId + '?from=miniprogram', {
					first_name: this.userInfo.first_name
				}).then(res => {
					if(res.data && res.data.data){
						console.log('更新用户资料----', res.data);
						uni.setStorageSync("userInfo", JSON.stringify(res.data.data));
						//uni.setStorageSync("token", resa.data.data.token);
						//uni.setStorageSync("isLogin", true);
						//uni.setStorageSync("userId", resa.data.data.user_id);
						this.userInfo = res.data.data;
						// uni.reLaunch({
						// 	url: "/myPages/create/create"
						// })
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 当视频进入和退出全屏时触发
			fullscreenchange(e) {
				console.log(e)
				if (e.detail.fullScreen) {
					this.videoContext.play();
				} else {
					this.videoContext.pause();
					this.videoContext = null
				}
			},
			onPlayVideo(index, type) {
				this.videoContext = uni.createVideoContext(type + index, this);
				this.videoContext.requestFullScreen({
					direction: 0 // 90 表示横屏，0 表示竖屏
				});
			},
			// 播放声音
			clickOnPlayAudio(url, index) {
				this.innerAudioContext.stop();
				this.innerAudioContext.src = url;
				this.innerAudioContext.play();
				this.playIndex = index
			},
			// 停止声音
			clickOnStopAudio() {
				this.innerAudioContext.stop();
				this.playIndex = null
			},
			gotoSynth(title, itemId) {
				if (this.default_videoInfo.length == 0) {
					uni.showToast({
						title: '请先设置个人形象和角色声音',
						duration: 2000,
						icon: 'none'
					});
					return
				}
				uni.redirectTo({
					url: '/scenePages/synth/synth?title=' + title + '&id=' + this.id + '&isPrivate=' + this.isPrivate +
						'&itemId=' + itemId
				});
			},
			// 修改排序
			postLiveVideoSort(id, index, type) {
				//console.log('index----',index)
				if (type == 'up') {
					let obj = this.recommendData[index]
					this.recommendData.splice(index, 1)
					this.recommendData.splice((index - 1), 0, obj)
				} else if (type == 'down') {
					let obj = this.recommendData[index]
					this.recommendData.splice(index, 1)
					this.recommendData.splice((index + 1), 0, obj)
				}
				// 数组排序
				const sortsString = []

				for (let i in this.recommendData) {
					sortsString.push(this.recommendData[i].id)
				}
				//console.log('newSort---', sortsString)

				uni.$u.http.post('/api/aigc_live_video_update/' + this.userId + '?from=miniprogram', {
					id: id,
					sorts: JSON.stringify(sortsString)
				}).then(res => {
					console.log('修改排序-----', res.data)
				}).catch(err => {
					console.log(err)
				})
			},
			// 更新互动场景
			postLiveUpdate() {
				if (!this.name) {
					uni.showToast({
						title: '请填写场景名称',
						duration: 2000,
						icon: 'none'
					});
					return
				}
				// if(!this.file){
				// 	uni.showToast({
				// 		title: '请上传场景封面',
				// 		duration: 2000,
				// 		icon:'none'
				// 	});
				// 	return
				// }
				if (!this.sub_title) {
					uni.showToast({
						title: '请填写场景简介',
						duration: 2000,
						icon: 'none'
					});
					return
				}
				uni.showLoading({
					title: '更新中',
					mask: true
				});
				uni.$u.http.post('/api/aigc_live_update/' + this.userId + '?from=miniprogram', {
					id: this.id,
					name: this.name,
					file: this.file,
					sub_title: this.sub_title
				}).then(res => {
					console.log('更新互动场景-----', res.data)
					this.postLiveConfigUpdate()
				}).catch(err => {
					console.log(err)
				})
			},
			// 更新场景扩展配置
			postLiveConfigUpdate() {
				const detailData = {
					default_audio: this.default_audioInfo,
					default_video: this.default_videoInfo,
				}
				const shareInfo = {
					share_title: this.share_title,
					show_title: this.show_title,
				}
				uni.$u.http.post('/api/aigc_lives_config_update/' + this.userId + '?from=miniprogram', {
					id: this.livesConfigInfo.id,
					nickname: this.nickname,
					avatar: this.avatar,
					audio: JSON.stringify(this.audioInfo),
					role_discription: this.role_discription,
					share_info: JSON.stringify(shareInfo),
					detail: JSON.stringify(detailData),
				}).then(res => {
					console.log('更新场景扩展配置-----', res.data)
					uni.hideLoading();
					// uni.redirectTo({
					// 	url: '/myPages/create/create'
					// });
					uni.navigateBack({
						delta: 1
					});
				}).catch(err => {
					console.log(err)
					uni.hideLoading();
				})
			},
			// 获取阿里云上传请求参数
			getAliyunOssSing() {
				uni.$u.http.get('/api/aliyun_oss_sign/' + this.userId + '?from=miniprogram').then(res => {
					if(res.data && res.data.data){
						//console.log('阿里云请求参数-----',res.data.data)
						this.aliyunOssSign = res.data.data;
					}
				}).catch(err => {
					console.log(err)
				})
			},

			// 上传视频
			uploadVideo(id) {
				const that = this
				uni.chooseVideo({
					sourceType: ['album'],
					compressed: false,
					success: function(res) {
						console.log('选定视频---', res)

						const tempFilePath = res.tempFilePath;
						const timestamp = new Date().getTime();
						const randomNum = Math.floor(Math.random() * 10000);
						const fileName = timestamp + "_" + randomNum + tempFilePath.substring(tempFilePath.lastIndexOf('.'));
						console.log('视频名称---', fileName)
						if (res.size > (500 * 1024 * 1024)) {
							that.$refs.uToast.show({
								message: "视频大小不能大于500MB"
							})
							return
						}

						if (res.width > 2160 || res.height > 4096) {
							that.$refs.uToast.show({
								message: "视频分辨率不能高于4K"
							})
							return
						}

						uni.showLoading({
							title: '上传中',
							mask: true
						});
						uni.uploadFile({
							url: that.aliyunOssSign.host,
							filePath: tempFilePath,
							name: 'file',
							formData: {
								key: that.aliyunOssSign.dir + fileName,
								policy: that.aliyunOssSign.policy,
								OSSAccessKeyId: that.aliyunOssSign.accessid,
								signature: that.aliyunOssSign.signature
							},
							success: (resa) => {
								console.log('上传------', resa)
								if (resa.statusCode == 204) {
									const video_url = that.aliyunOssSign.host + '/' + that.aliyunOssSign.dir + fileName
									uni.hideLoading();
									uni.$u.http.post('/api/aigc_live_video_update/' + that.userId + '?from=miniprogram', {
										id: id,
										video_url: video_url
									}).then(res => {
										console.log('更新推荐词条-----', res.data)

										uni.showToast({
											title: '上传成功',
											duration: 2000,
											icon: 'none'
										});
										that.getRecommendData()
										that.getLiveData()
									}).catch(err => {
										console.log(err)
									})

								} else {
									uni.hideLoading();
									that.$refs.uToast.show({
										message: "上传失败,请重新上传"
									})
								}
							}
						});


					}
				});
			},

			// 上传背景图片
			upCoverPhoto(type) {
				const that = this
				uni.chooseImage({
					count: 1,
					success: function(res) {
						const tempFilePath = res.tempFilePaths[0];
						const timestamp = new Date().getTime();
						const randomNum = Math.floor(Math.random() * 10000);
						const fileName = timestamp + "_" + randomNum + tempFilePath.substring(tempFilePath.lastIndexOf('.'));
						console.log('视频名称---', fileName)
						uni.showLoading({
							title: '上传中',
							mask: true
						});
						uni.uploadFile({
							url: that.aliyunOssSign.host,
							filePath: tempFilePath,
							name: 'file',
							formData: {
								key: that.aliyunOssSign.dir + fileName,
								policy: that.aliyunOssSign.policy,
								OSSAccessKeyId: that.aliyunOssSign.accessid,
								signature: that.aliyunOssSign.signature
							},
							success: (resa) => {
								console.log('上传------', resa)
								if (resa.statusCode == 204) {
									if (type == 'avatar') {
										that.avatar = that.aliyunOssSign.host + '/' + that.aliyunOssSign.dir + fileName
									} else {
										that.file = that.aliyunOssSign.host + '/' + that.aliyunOssSign.dir + fileName
									}

									uni.hideLoading();
								} else {
									uni.hideLoading();
									uni.showToast({
										title: '上传失败,请重新上传',
										duration: 2000,
										icon: 'none'
									});
								}
							}
						});
					}
				});
			},
			selectAiSound(item) {
				this.showAiSound = false
				this.audioInfo = item
				//this.audio = JSON.stringify(this.audioInfo)
			},
			selectSound(item) {
				this.showSound = false
				this.default_audioInfo = item
				//this.default_audio = JSON.stringify(this.default_audioInfo)
			},
			selectImage(item) {
				this.showImage = false
				this.default_videoInfo = item;
				//this.default_video = JSON.stringify(this.default_videoInfo);
				console.log(item, 'item--');
				console.log(this.default_videoInfo, '-selectImage=this.default_videoInfo-=')
			},
			// 更新推荐词条名称
			postLiveVideoUpdate() {
				if (!this.newName) {
					uni.showToast({
						title: '请输入新名称',
						duration: 2000,
						icon: 'none'
					});
					return
				}
				console.log(this.wordId)
				console.log(this.newName)
				uni.$u.http.post('/api/aigc_live_video_update/' + this.userId + '?from=miniprogram', {
					id: this.wordId,
					title: this.newName
				}).then(res => {
					console.log('更新推荐词条-----', res.data)
					this.showEntries = false
					uni.showToast({
						title: '更新成功',
						duration: 2000,
						icon: 'none'
					});
					this.getRecommendData()
					this.getLiveData()
				}).catch(err => {
					console.log(err)
				})
			},

			moreSetting(id, url, status) {
				this.changeId = id;
				this.downloadUrl = url;
				this.itemStatus = status;
				let status_name = "设为草稿词条";
				if (status == 1) {
					status_name = "设为普通词条";
				}
				this.listSheet = [{
						val: 1,
						name: status_name
					},
					{
						val: 2,
						name: '设为开场词条'
					},
					{
						val: 3,
						name: '设为分享解锁词条'
					},
					{
						val: 4,
						name: '下载视频'
					},
					{
						val: 5,
						name: '删除'
					},
					{
						val: 6,
						name: '取消'
					}
				]
				if (status == 2) {
					this.listSheet = [{
							val: 1,
							name: status_name
						},
						{
							val: 2,
							name: '设为开场词条'
						},
						{
							val: 4,
							name: '下载视频'
						},
						{
							val: 5,
							name: '删除'
						},
						{
							val: 6,
							name: '取消'
						}
					]
				}

				this.showPower = true
			},

			changeCategory(id) {
				this.changeId = id;
				this.listSheet = [{
						val: 1,
						name: '开场问候'
					},
					{
						val: 3,
						name: '取消'
					}
				]
				this.showPower = true
			},
			clickSheetPower(val, name) {
				this.showPower = false
				if (!this.changeId) {
					return
				}

				let url = this.downloadUrl;
				let status = this.itemStatus;
				let id = this.changeId;

				if (val === 1) {
					if (status == 1) {
						this.postLiveVideoUpdates(id, 0)
					} else {
						this.postLiveVideoUpdates(id, 1)
					}

					return
				} else if (val === 2) {
					const that = this
					uni.showModal({
						title: '提示',
						content: '确定切换视频为：开场词条',
						success: function(respons) {
							if (respons.confirm) {
								uni.$u.http.post('/api/aigc_live_video_update/' + that.userId + '?from=miniprogram', {
									id: that.changeId,
									type: 0,
									category: 1,
								}).then(res => {
									console.log('更新场景分类-----', res.data)

									uni.showToast({
										title: '更新成功',
										duration: 2000,
										icon: 'none'
									});
									that.getRecommendData()
									that.getLiveData()

								}).catch(err => {
									console.log(err)
								})
							}
						}
					});
					return
				} else if (val === 3) {
					this.postLiveVideoUpdates(id, 2)
					return
				} else if (val === 4) {
					this.downloadVideo(url)
					return
				} else if (val === 5) {
					this.postLiveVideoDel(id)
					return
				} else if (val === 6) {
					return
				} else {
					return
				}

			},
			openPower() {
				this.showPower = true
				// console.log('open');
			},
			closePower() {
				this.showPower = false
				// console.log('close');
			},
			downloadVideo(url) {
				uni.showLoading({
					title: '下载中...'
				});
				uni.downloadFile({
					url: url, //仅为示例，并非真实的资源
					success: (res) => {
						console.log(url)
						if (res.statusCode === 200) {
							console.log('下载成功');
							const tempFilePath = res.tempFilePath;
							// 2. 保存到相册
							uni.saveVideoToPhotosAlbum({
								filePath: tempFilePath,
								success: () => {
									uni.hideLoading();
									uni.showToast({
										title: '已保存到相册',
										icon: 'none'
									});
								},
								fail: (err) => {
									uni.hideLoading();
									uni.showToast({
										title: '保存失败',
										icon: 'none'
									});
									console.error('保存失败:', err);
								}
							});
						}
						console.log('下载成功', res);
					}
				});
			},

			// 更新推荐词条
			postLiveVideoUpdates(id, status) {
				uni.$u.http.post('/api/aigc_live_video_update/' + this.userId + '?from=miniprogram', {
					id: id,
					status: status
				}).then(res => {
					console.log('更新推荐词条-----', res.data)
					uni.showToast({
						title: '更新成功',
						duration: 2000,
						icon: 'none'
					});
					this.getRecommendData()
					this.getLiveData()
				}).catch(err => {
					console.log(err)
				})


			},

			// 删除推荐词条
			postLiveVideoDel(id) {
				const that = this
				uni.showModal({
					title: '提示',
					content: '确定删除吗？删除后无法恢复。',
					success: function(resp) {
						if (resp.confirm) {
							uni.$u.http.post('/api/aigc_live_video_update/' + that.userId + '?from=miniprogram', {
								id: id,
								is_del: 1
							}).then(res => {
								console.log('删除推荐词条-----', res.data)
								that.showEntries = false
								uni.showToast({
									title: '删除成功',
									duration: 2000,
									icon: 'none'
								});
								that.getRecommendData()
								that.getLiveData()
							}).catch(err => {
								console.log(err)
							})
						}
					},
				});

			},
			// 新建词条
			postLiveVideoAdd() {
				if (!this.wordTitle) {
					uni.showToast({
						title: '请输入词条的名称',
						duration: 2000,
						icon: 'none'
					});
					return
				}
				if (!this.wordkey) {
					uni.showToast({
						title: '请输入词条的关键字',
						duration: 2000,
						icon: 'none'
					});
					return
				}
				uni.$u.http.post('/api/aigc_live_video_add/' + this.userId + '?from=miniprogram', {
					live_id: this.id,
					type: 1,
					title: this.wordTitle,
					name: this.wordkey
				}).then(res => {
					console.log('新建词条-----', res.data)
					this.showAddEntries = false
					uni.showToast({
						title: '添加成功,请合成视频',
						duration: 2000,
						icon: 'none'
					});
					this.getRecommendData()
				}).catch(err => {
					console.log(err)
				})
			},
			// 获取推荐词条
			getRecommendData() {
				console.log('获取推荐词条--this.userId---', this.userId)
				console.log('获取推荐词条--this.id---', this.id)
				uni.$u.http.get('/api/aigc_live_videos/' + this.userId + '?from=miniprogram&type=1&live_id=' + this.id).then(
					res => {console.log('获取推荐词条-----', res)
						if(res.data && res.data.data){
							console.log('获取推荐词条-----', res.data.data);
							let d = res.data.data;
							for(let k in d){
								d[k]['playStatus'] = false;
							}
							this.recommendData = d;
							console.log(this.recommendData, '=-=-=getRecommendData-=-');
						}
					}).catch(err => {
					console.log(err)
				})
			},
			// 获取场景视频
			getLiveData() {
				uni.$u.http.get('/api/aigc_live_videos/' + this.userId + '?from=miniprogram&type=0&live_id=' + this.id).then(
					res => {
						if(res.data && res.data.data){
							console.log('获取场景视频-----', res.data.data)
							this.liveData = res.data.data;
						}
					}).catch(err => {
					console.log(err)
				})
			},
			// 获取互动扩展信息
			getLivesConfigInfo() {
				uni.$u.http.get('/api/aigc_lives_config/' + this.userId + '?from=miniprogram&live_id=' + this.id).then(res => {
					if(res.data && res.data.data){
						console.log('获取互动扩展信息-----', res.data.data)
						this.livesConfigInfo = res.data.data;

						this.share_title = this.livesConfigInfo.share_info.share_title;
						this.show_title = this.livesConfigInfo.share_info.show_title;
						this.nickname = this.livesConfigInfo.nickname;
						this.avatar = this.livesConfigInfo.avatar;
						this.role_discription = this.livesConfigInfo.role_discription;

						this.default_videoInfo = this.livesConfigInfo.detail.default_video;
						this.default_audioInfo = this.livesConfigInfo.detail.default_audio;
						this.audioInfo = this.livesConfigInfo.audio;
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 获取详情
			getLiveVideoInfo() {
				uni.$u.http.get('/api/aigc_lives_list/' + this.userId + '?from=miniprogram&id=' + this.id).then(res => {
					if(res.data && res.data.data){
						console.log('获取详情-----', res.data.data[0])
						this.liveInfo = res.data.data[0]
						this.name = this.liveInfo.name,
						this.file = this.liveInfo.file,
						this.sub_title = this.liveInfo.sub_title;
					}
				}).catch(err => {
					console.log(err)
				})
			},
			// 我的形象
			getSourceList() {
				uni.$u.http.get('/api/speed_source_list/' + this.userId + '?from=miniprogram&type=0&count=999').then(res => {
				if(res.data && res.data.data){
					//console.log('我的形象-----',res.data.data)
					this.sourceData = res.data.data;
				}
				}).catch(err => {
					console.log(err)
				})
			},
			// 我的声音
			getVoiceList() {
				//个人定制
				uni.$u.http.get('/api/speed_voice_list/' + this.userId + '?from=miniprogram&count=999&status=0').then(res => {
				if(res.data && res.data.data){
					console.log('我的声音-----', res.data.data)
					this.voiceData = res.data.data;
				}
				}).catch(err => {
					console.log(err)
				})
				//公共声音
				uni.$u.http.get('/api/speed_voice_list/' + this.userId + '?from=miniprogram&count=999&status=0&is_public=1')
					.then(res => {
						if(res.data && res.data.data){
							console.log('我的声音-----', res.data.data)
							this.voiceData = this.voiceData.concat(res.data.data);
						}
					}).catch(err => {
						console.log(err)
					})
			},
			// 小助理声音列表
			assistantList() {
				uni.$u.http.get('/api/speed_assistant_list/' + this.userId + '?from=miniprogram').then(res => {
					if(res.data && res.data.data){
						console.log('小助理声音列表-----', res.data.data)
						this.assistData = res.data.data;
					}
				}).catch(err => {
					console.log(err)
				})
			},
			clickEntriesName() {
				if (!this.newName) {
					uni.showToast({
						title: '请输入词条的名称',
						duration: 2000,
						icon: 'none'
					});
				} else {
					this.showEntries = false
				}
			},
			openAddEntries() {
				// console.log('open');
			},
			closeAddEntries() {
				this.showAddEntries = false
				// console.log('close');
			},
			openEntries() {
				// console.log('open');
			},
			closeEntries() {
				this.showEntries = false
				// console.log('close');
			},
			clickTabs(index) {
				this.tabsIndex = index
				if (index == 0) {
					this.innerAudioContext.stop();
					this.playIndex = null
				}
			},
			openAiSound() {
				// console.log('open');
			},
			closeAiSound() {
				this.showAiSound = false
				this.innerAudioContext.stop();
				this.playIndex = null
				// console.log('close');
			},
			openSound() {
				// console.log('open');
			},
			closeSound() {
				this.showSound = false
				this.innerAudioContext.stop();
				this.playIndex = null
				// console.log('close');
			},
			openImage() {
				// console.log('open');
			},
			closeImage() {
				this.showImage = false
				// console.log('close');
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
						filePath: url,
						name: 'file',
						formData: {
							user: 'test'
						},
						success: (res) => {
							setTimeout(() => {
								resolve(res.data.data)
							}, 1000)
						}
					});
				})
			},
			/** 形象视频播放控制 */
			playVideo() {
				const videoPlayer = this.$refs.profileVideoPlayer;
				console.log('-=playVideo-=');
				if (this.pVideoPlay) {
					this.pVideoPlay = false;
					videoPlayer.pause();
				} else{
					this.pVideoPlay = true;
					videoPlayer.play();
				}
			},
			//RECOMMEND视频播放
			playRecommendVideo(index){
				const idx = index
				console.log('--=idx-', idx);
				for (let index = 0; index < this.recommendData.length; index++) {
				  const [currRef] = this.$refs[`sVideo_${index}`]
				  if (index === idx) {
				    // 当前视频播放
				    currRef && currRef.play();
					this.recommendData[index].playStatus = true;
				  } else {
				    // 其他视频暂停
				    currRef && currRef.pause();
					this.recommendData[index].playStatus = false;
				  }
				}
			},
			// 当视频进入和退出全屏时触发
			// 进入/退出全屏 - 事件
			onFullscreenChange(e) {
			  console.log('--onFullScreenChange--', e)
			},
		}
	}
</script>

<style lang="scss" scoped>
	.personal_textarea {
		display: block;
		width: 100%;
		font-size: 26rpx;
		background: #2C2C2C;
		box-sizing: border-box;
		border: none;
		border-radius: 10rpx;
		color: #fff;
		height: 200rpx;
		line-height: 36rpx;
	}

	.power_sheet {
		padding: 20rpx;
		width: 100%;
		box-sizing: border-box;

		.item {
			color: #fff;
			font-size: 26rpx;
			font-weight: 600;
			line-height: 40rpx;
			text-align: center;
			padding: 30rpx;
		}
	}

	.entries_box {
		width: 670rpx;

		.entries_input {
			padding: 0 40rpx 40rpx;
		}

		.entries_box_btn {
			border-top: 1rpx solid #585858;
			height: 100rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 30rpx;

			.item {
				width: 50%;
				text-align: center;
				line-height: 100rpx;
				font-size: 26rpx;
				font-weight: 600;
				line-height: 40rpx;
				color: #959595;

				&.yellow {
					color: #FFB200;
				}
			}
		}

		.title {
			text-align: center;
			font-size: 28rpx;
			font-weight: normal;
			line-height: 40rpx;
			color: #FFFFFF;
			padding: 30rpx 0;
		}
	}

	.scene_select_image {
		position: relative;
		height: 330rpx;
		overflow: hidden;
		display: flex;
		align-items: flex-end;
		justify-content: flex-start;

		.ph {
			display: block;
			width: 100%;
		}

		.ico {
			position: absolute;
			left: 50%;
			top: 50%;
			width: 70rpx;
			height: 70rpx;
			margin-left: -35rpx;
			margin-top: -35rpx;
			z-index: 9;
		}

		.btn {
			width: 95rpx;
			height: 44rpx;
			border-radius: 32.5px;
			background: #FFB200;
			text-align: center;
			font-size: 20rpx;
			font-weight: normal;
			line-height: 44rpx;
			color: #1F1F1F;
			margin-left: 30rpx;
		}
		.video-action {
			position: absolute;
			top: 46%;
			left: 85rpx;
			width: 55rpx;
			height: 55rpx;
			border-radius: 27.5rpx;
			background-color: rgba(0, 0, 0, 0.3);
			z-index: 1;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
		}
	}

	.scene_select_sound {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 70rpx;
		border-radius: 10rpx;
		background: #2C2C2C;
		padding: 0 20rpx;
		box-sizing: border-box;

		.ico {
			flex-shrink: 0;
			width: 38rpx;
			height: 38rpx;
			margin-right: 10rpx;
		}

		.name {
			width: 100%;
			font-size: 26rpx;
			font-weight: 600;
			line-height: 40rpx;
			color: #FFFFFF;
		}

		.btn {
			width: 95rpx;
			height: 44rpx;
			border-radius: 32.5px;
			background: #FFB200;
			text-align: center;
			font-size: 20rpx;
			font-weight: normal;
			line-height: 44rpx;
			color: #1F1F1F;
		}
	}

	.select_box {
		width: 610rpx;
		border-radius: 10rpx;

		.sound_list {
			width: 100%;
			height: 410rpx;
			overflow-y: auto;
			padding: 0 40rpx;
			box-sizing: border-box;

			.item {
				display: flex;
				align-items: center;
				justify-content: space-between;
				height: 70rpx;
				border-radius: 10rpx;
				background: #2C2C2C;
				padding: 0 20rpx;
				margin-bottom: 30rpx;
				box-sizing: border-box;

				.ico {
					flex-shrink: 0;
					width: 38rpx;
					height: 38rpx;
					margin-right: 10rpx;
				}

				.name {
					width: 100%;
					font-size: 26rpx;
					font-weight: 600;
					line-height: 40rpx;
					color: #FFFFFF;
				}

				.btn {
					width: 95rpx;
					height: 44rpx;
					border-radius: 32.5px;
					background: #FFB200;
					text-align: center;
					font-size: 20rpx;
					font-weight: normal;
					line-height: 44rpx;
					color: #1F1F1F;
				}
			}
		}

		.image_list {
			width: 100%;
			height: 420rpx;
			overflow-y: auto;
			display: flex;
			flex-wrap: wrap;
			padding: 0 10rpx;

			.item {
				margin-left: 30rpx;
				padding-bottom: 30rpx;

				.info {
					position: relative;
					width: 160rpx;
					height: 280rpx;
				}

				.ph {
					display: block;
					width: 160rpx;
					height: 280rpx;
					border-radius: 10rpx;
				}

				.name {
					position: absolute;
					left: 0;
					bottom: 0;
					right: 0;
					width: 100%;
					height: 50rpx;
					box-sizing: border-box;
					line-height: 50rpx;
					overflow: hidden;
					background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3981) 100%);
					color: #fff;
					font-size: 20rpx;
					padding: 0 10rpx;
				}

				.btn {
					width: 95rpx;
					height: 44rpx;
					border-radius: 32.5px;
					background: #FFB200;
					text-align: center;
					font-size: 20rpx;
					font-weight: normal;
					line-height: 44rpx;
					color: #1F1F1F;
					margin: 18rpx auto 0;
				}
			}

		}

		.title {
			text-align: center;
			font-size: 28rpx;
			font-weight: normal;
			line-height: 40rpx;
			color: #FFFFFF;
			padding: 25rpx 0 25rpx;
		}
	}

	/deep/.u-upload__wrap__preview {
		margin: 0;
	}

	.scene_add {
		padding: 0 40rpx;

		.head-line {
			.head {
				display: flex;
				justify-content: center;
				align-items: center;

				.avatar {
					margin-top: 20rpx;
					width: 160rpx;
					height: 160rpx;
					border-radius: 50%;
					border: 2rpx solid #fff;
					box-sizing: border-box;
					overflow: hidden;
				}


			}

			.name {
				font-size: 26rpx;
				font-weight: normal;
				line-height: 40rpx;
				color: #FFFFFF;
				text-align: center;
				margin-top: 15rpx;
			}
		}


		.line-item {
			margin-top: 30rpx;
			padding: 0rpx 30rpx 20rpx 30rpx;
			display: flex;
			align-items: flex-start;
			justify-content: space-between;
			background: #2C2C2C;
			border-radius: 15rpx;

			.title {
				flex-shrink: 0;
				font-size: 26rpx;
				font-weight: normal;
				line-height: 30rpx;
				text-align: justify;
				color: #FFFFFF;
				width: 160rpx;

				text {
					display: block;
					color: #FF1313;
					font-size: 26rpx;
					line-height: 30rpx;
				}

				.text {
					color: #979797;
					font-size: 26rpx;
					line-height: 40rpx;
				}
			}

			.info {
				padding-top: 18rpx;
				width: 100%;
				font-size: 26rpx;
				font-weight: normal;
				line-height: 30rpx;
			}


		}

		.line-item-block {
			margin-top: 30rpx;
			padding: 0rpx 30rpx 20rpx 30rpx;
			display: block;
			align-items: flex-start;
			justify-content: space-between;
			background: #2C2C2C;
			border-radius: 15rpx;

			.line-title {
				flex-shrink: 0;
				font-size: 26rpx;
				font-weight: normal;
				line-height: 30rpx;
				text-align: justify;
				color: #FFFFFF;

				text {
					display: block;
					color: #FF1313;
					font-size: 26rpx;
					line-height: 30rpx;
				}

				.text {
					color: #979797;
					font-size: 26rpx;
					line-height: 40rpx;
				}
			}

			.line-info {
				width: 100%;
				font-size: 26rpx;
				font-weight: normal;
				line-height: 30rpx;
			}
		}

		.scene_select {
			display: inline-flex;
			align-items: center;
			height: 50rpx;
			border-radius: 6rpx;
			box-sizing: border-box;
			border: 1rpx solid #F9BE01;
			padding: 0 15rpx 0 20rpx;

			.name {
				font-size: 26rpx;
				font-weight: 500;
				line-height: 40rpx;
				color: #F9BE01;
				padding-right: 10rpx;
			}
		}

		.title {
			display: flex;
			align-items: center;
			padding: 40rpx 0 20rpx;

			.text {
				color: #979797;
				font-size: 26rpx;
				line-height: 40rpx;
			}

			.name {
				font-size: 26rpx;
				font-weight: normal;
				line-height: 40rpx;
				color: #FFFFFF;
			}

			text {
				display: block;
				color: #FF1313;
				font-size: 26rpx;
				line-height: 40rpx;
			}
		}
	}

	.footer_none {
		width: 100%;
		height: 160rpx;
	}

	.footer_yellow_btn {
		position: fixed;
		left: 40rpx;
		right: 0;
		bottom: 60rpx;
		width: 670rpx;
		height: 70rpx;
		border-radius: 35rpx;
		background: #F9BE01;
		line-height: 70rpx;
		text-align: center;
		font-size: 26rpx;
		color: #292D32;
		font-weight: 600;
		z-index: 999;
	}

	.entries {
		padding: 0 40rpx;

		.item {
			border-radius: 15rpx;
			background: #2C2C2C;
			box-shadow: 2rpx 2rpx 30rpx 0rpx rgba(0, 0, 0, 0.05);
			margin-top: 40rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 20rpx;

			.btn_sort {
				flex-shrink: 0;

				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: space-between;

				.btn {
					padding: 10rpx;
				}

				.ico {
					display: block;
					width: 42rpx;
					height: 42rpx;
				}
			}

			.cover {
				flex-shrink: 0;
				width: 64rpx;
				height: 108rpx;
				border-radius: 8rpx;
				background: linear-gradient(to bottom right, #e8e7e2e3 0%, #777575bf 100%);
				position: relative;
				overflow: hidden;
				.video-action {
					position: absolute;
					top: 46%;
					left: 40%;
					width: 15rpx;
					height: 15rpx;
					border-radius: 15rpx;
					background-color: rgba(0, 0, 0, 0.3);
					z-index: 1;
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;
				}
				.ph {
					width: 64rpx;
					height: 108rpx;
					border-radius: 8rpx;
				}

				.ico_video {
					position: absolute;
					left: 50%;
					top: 50%;
					z-index: 10;
					width: 20rpx;
					height: 20rpx;
					margin-top: -10rpx;
					margin-left: -10rpx;
				}

				.ico_play2 {
					position: absolute;
					left: 50%;
					top: 50%;
					z-index: 10;
					width: 30rpx;
					height: 30rpx;
					margin-top: -15rpx;
					margin-left: -15rpx;
				}
			}

			.info {
				width: 100%;

				.title {
					font-size: 26rpx;
					font-weight: 600;
					line-height: 30rpx;
					color: #fff;
					padding-left: 20rpx;
					padding-bottom: 22rpx;
				}

				.btns {
					display: flex;
					align-items: center;

					.btns_item {
						display: flex;
						align-items: center;
						justify-content: center;
						height: 50rpx;
						border-radius: 30rpx;
						background: #4B4B4B;
						padding: 0 15rpx 0 15rpx;
						margin-left: 20rpx;

						.ico {
							width: 36rpx;
							height: 36rpx;
						}

						text {
							display: block;
							font-size: 20rpx;
							font-weight: normal;
							color: #FFFFFF;
							line-height: 30rpx;
						}
					}

					.btns_item2 {
						display: flex;
						align-items: center;
						justify-content: center;
						height: 50rpx;
						border-radius: 30rpx;
						background: #FFB200;
						padding: 0 20rpx;
						margin-left: 20rpx;

						.ico {
							width: 36rpx;
							height: 36rpx;
							margin-right: 5rpx;
						}

						text {
							display: block;
							font-size: 20rpx;
							font-weight: normal;
							color: #292D32;
							line-height: 30rpx;
						}
					}
				}
			}
		}

	}

	.scene_set_tabs {
		display: flex;
		align-items: center;
		padding: 10rpx 40rpx 6rpx;

		.item {
			font-size: 26rpx;
			font-weight: normal;
			line-height: 44rpx;
			color: #A7A7A7;
			margin-right: 60rpx;
			position: relative;

			&.hover {
				color: #fff;
				font-size: 26rpx;
				font-weight: 600;

				&::after {
					content: '';
					position: absolute;
					left: 50%;
					bottom: -6rpx;
					width: 40rpx;
					height: 5rpx;
					margin-left: -20rpx;
					border-radius: 3rpx;
					background: #FFB200;
				}
			}
		}
	}

	.yellow_btn {
		padding: 50rpx 40rpx 70rpx;

		.btn {
			height: 70rpx;
			border-radius: 35rpx;
			background: #F9BE01;
			line-height: 70rpx;
			text-align: center;
			font-size: 26rpx;
			font-weight: normal;
			color: #292D32;
		}
	}
</style>